let tableIns;
let tree;
var element;
layui.use(['element', 'form', 'table', 'layer', 'laydate', 'tree', 'util'], function () {
    // 声明
    element = layui.element;
    let table = layui.table;
    let jwtOb = JSON.parse(localStorage.getItem('auth_token'));
    var headers = {
        // Basic bearer
        'Authorization':'Basic '+jwtOb.additionalInformation.jti
    }
    // 隐藏编辑及诶按
    tableIns = table.render({
        elem: '#userTable'
        ,url:'/user/c/queryUserList'
        ,method:'POST'
        // JWT
        ,headers: headers
        ,where:{
            queryByLoginName: ''
        }
        ,parseData: function(res){ //res 即为原始返回的数据
            let result = {};
            if (res.code === '00000'){
                result = {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.data.total, //解析数据长度
                    "data": res.data.list //解析数据列表
                }
            }else{
                result = {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": 0, //解析数据长度
                    "data": {} //解析数据列表
                }
            }
            return result;
        }
        ,page: true
        ,limit: 10
        ,limits : [10, 20, 30, 40]
        //全局定义常规单元格的最小宽度，layui 2.2.1 新增
        ,cellMinWidth: 80
        //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
        ,toolbar: '#toolbarUser' // 开启头部工具栏，并为其绑定左侧模板
        // 自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
        ,defaultToolbar: ['filter', 'exports', 'print', {
            title: '提示'
            ,layEvent: 'LAYTABLE_TIPS'
            ,icon: 'layui-icon-tips'
        }]
        ,title: '用户数据表'
        // width 支持：数字、百分比和不填写。你还可以通过 minWidth 参数局部定义当前单元格的最小宽度，layui 2.2.1 新增
        ,cols: [[
            {type: 'checkbox', fixed: 'left'}
            ,{field:'userId', title: 'ID', sort: true}
            ,{field:'userName', title: '用户名'}
            ,{field:'userSex', title: '性别', sort: true, templet: function (row) {
                    // 0-男；1-女 2-其他
                    if (row.userSex == 0) {
                        return '男';
                    }else if (row.userSex == 1) {
                        return '女';
                    }else{
                        return '其他';
                    }
                }}
            ,{field:'userPhone', title: '联系方式'}
            ,{field:'userAccount', title: '登录账户'}
            ,{field:'userLevelId', title: 'VIP', align: 'center'} //单元格内容水平居中
            ,{field:'userLoginTime', title: '登录时间', sort: true, align: 'right'} //单元格内容水平居中
            ,{field:'userRemark', title: '备注'}
            ,{fixed: 'right', title:'操作', toolbar: '#barUser', width:150}
        ]]
    });

    //头工具栏事件
    table.on('toolbar(test)', function(obj){
        var checkStatus = table.checkStatus(obj.config.id);
        switch(obj.event){
            case 'getCheckData':
                var data = checkStatus.data;
                layer.alert(JSON.stringify(data));
                break;
            case 'getCheckLength':
                var data = checkStatus.data;
                layer.msg('选中了：'+ data.length + ' 个');
                break;
            case 'isAll':
                layer.msg(checkStatus.isAll ? '全选': '未全选');
                break;
            //自定义头工具栏右侧图标 - 提示
            case 'LAYTABLE_TIPS':
                layer.alert('这是工具栏右侧自定义的一个图标按钮');
                break;
            case 'addData':
                let url ="/userEdit?eq=add";
                let text = "用户编辑";
                layer.open({
                    type: 2, //Layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）,
                    shade:0.1, //遮罩层透明度
                    area:['850px','500px'], //弹出层宽高
                    title:text,//弹出层标题
                    content: url //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
                });
                break;
            case 'query':
                let queryByLoginName = $("#queryByLoginName").val();
                let query = {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    , done: function (res, curr, count) {
                        //完成后重置where，解决下一次请求携带旧数据
                        // this.where = {};
                    }
                };
                if (!queryByLoginName) {
                    queryByLoginName = "";
                }
                //设定异步数据接口的额外参数
                query.where = {loginName: queryByLoginName};
                tableIns.reload(query);
                $("#queryByLoginName").val(queryByLoginName);
                break;
            case 'reload':
                tableInsOnLine.reload();
                break;
        };
    });

    //监听行工具事件
    table.on('tool(test)', function(obj){
        var data = obj.data;
        if(obj.event === 'del'){
            layer.confirm('确认删除吗？', function (index) {
                // 向服务端发送删除指令
                $.delete("/user/c/deleteUser?userId="+data.userId, {}, headers, function (data) {
                    if (data.code === '00000'){
                        layer.msg('删除成功');
                    }else{
                        layer.msg(data.msg);
                    }
                    // 表格刷新
                    tableIns.reload();
                    layer.close(index);
                })
            });
        } else if(obj.event === 'edit'){
            let url ="/userEdit?eq=edit";
            let text = "用户编辑";
            localStorage.setItem('userEdit_data', JSON.stringify(data));
            layer.open({
                type: 2, //Layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）,
                shade:0.1, //遮罩层透明度
                area:['850px','500px'], //弹出层宽高
                title:text,//弹出层标题
                content: url //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
            });
        }
    });

});
